import React from "react";
import ReactDOM from "react-dom/client";
import Login from "./login";
import Chat from "./chatRoom";
import Book from "./addressBook";
import Profile from "./profile";
import { BrowserRouter, Routes, Route } from "react-router-dom";
import Sidebar from "./components/Sidebar/index";
import WebIM from './util/WebIM';
import store from "./store/index";
import { Provider } from 'react-redux';
import { getUserInfo } from './util';
import "./assets/css/index.less";

const userInfo = getUserInfo();

if (userInfo) {
  const { username_connect: user, password_connect: pwd } = userInfo;
  let options = {
    user,
    pwd
  };
  WebIM.conn.open(options);
}

window.addEventListener('click', (e) => {
  const mead: any = document.getElementById('mead');
  if (mead && mead.style) {
    mead.style.display = 'none';
  }
})

const root = ReactDOM.createRoot(document.getElementById('root') as ReactDOM.Container);
root.render(
  <React.StrictMode>
    <div className="root">
      <BrowserRouter>
        <Sidebar />
        <Provider store={store}>
          <Routes>
            <Route path="/" element={<Login />} />
            <Route path="/chat" element={<Chat />} />
            <Route path="/book" element={<Book />} />
            <Route path="/profile" element={<Profile />} />
          </Routes>
        </Provider>
      </BrowserRouter>
    </div>
  </React.StrictMode>
);
